<!DOCTYPE html>
<html lang="en">
<head>
    <title>Matrix Admin</title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="css/bootstrap.min.css" />
    <link rel="stylesheet" href="css/bootstrap-responsive.min.css" />
    <link rel="stylesheet" href="css/uniform.css" />
    <link rel="stylesheet" href="css/select2.css" />
    <link rel="stylesheet" href="css/matrix-style2.css" />
    <link rel="stylesheet" href="css/matrix-media.css" />
    <link href="font-awesome/css/font-awesome.css" rel="stylesheet" />
    <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700,800' rel='stylesheet' type='text/css'>

</head>
<style>

    .content-info{
        /*overflow: auto;*/
    /*}*/
    /*.content-info span{*/
        /*padding: 6px 0;*/
        /*float: left;*/
        /*width: 50%;*/
        /*display: block;*/
    /*}*/
    /*.td-btn{*/
        /*width: 150px;*/
    /*}*/
    /*************许永霖**********/
    /*.demo1{*/
        /*float: right;*/
        /*position: relative;*/
        /*right: 10px;*/
    /*}*/
    /*.demo1 ul{*/
        /*margin: 0px;*/
        /*padding: 0px;*/
    /*}*/
    /*.demo1 ul li {*/
        /*float:left;*/
        /*list-style-type:none;*/
        /*margin-left: 5px;*/
        /*!*line-height:15px;*!*/
    /*}*/
    /*.demo1 ul li input{*/
        /*width: 120px;*/
    /*}*/

     /*.dataTables_filter input{display: none}*/
    /*.dataTables_filter{display: none}*/
    /*select[multiple], select{display: none}*/
    /*.dataTables_length{display: none}*/
    /** li{ list-style-type: none;}*/
    /*.renyuan_count{*/
        /*float: left;*/
        /*margin-left: 0px;*/
        /*margin-bottom: 0px;*/
        /*width:55%;*/
        /*height: 230px;*/
        /*!*background-color: #ededed;*!*/
        /*!*background-color: #ffffff;*!*/
    /*}*/

    /*.widget-title{*/
        /*margin-left: 1%;*/
    /*}*/

    /*.renyuan_count ul{*/
        /*!*margin-left: 5px;*!*/
        /*width:100%;*/
        /*height:160px;*/
        /*!*background-color:#989898;*!*/
    /*}*/
    /*.renyuan_count ul li{*/
        /*!*margin-top: 1px;*!*/
        /*!*margin-left: 1px;*!*/
        /*float: left;*/
        /*color: #696969;*/
        /*list-style-type: none;*/
        /*width:25%;*/
        /*height: 2.5rem;*/
        /*text-align:left;*/
        /*background-color: #f7f7f7;*/
        /*padding-left: 60px;*/
        /*line-height: 40px;*/
    /*}*/



    /********end***********/
</style>
<body>

<div id="content">
    <div id="content-header">
        <h1>考勤管理</h1>
    </div>
    <div class="container-fluid">
        <div class="row-fluid">
            <div class="span12">
                <div class="widget-box">
                    <div class="widget-title"> <span class="icon"> <i class="icon-list"></i> </span>
                        <h5>项目名称：武汉市金地天悦</h5>
                    </div>
                    <div class="widget-content nopadding">
                        <table class="table table-bordered ">
                            <tbody>
                        <tr class="even gradeC">
                        <td>当前人数：111人</td>
                        <td>施工人员：100人</td>
                        <td>特种作业：15人</td>
                        <td class="center">未到人数：2人</td>
                        </tr>
                        <tr class="odd gradeA">
                        <td>水泥工&nbsp&nbsp ：50人</td>
                        <td>钢筋工&nbsp&nbsp ：10人</td>
                        <td>土木工&nbsp&nbsp ：5人</td>
                        <td class="center">架子工&nbsp&nbsp ：5人</td>

                        </tr>
                        <tr class="even gradeA">
                        <td>防水工&nbsp&nbsp ：5人</td>
                        <td>砌筑工&nbsp&nbsp ：7人</td>
                        <td>塔吊工&nbsp&nbsp ：5人</td>
                        <td class="center">监理&nbsp&nbsp &nbsp&nbsp ：7人</td>

                        </tr>
                        </tbody>
                        </table>
                    </div>

                    <!--<table class="table table-bordered table-striped " >-->

                        <!--<tbody>-->
                        <!--<tr class="even gradeC">-->
                            <!--<td>当前人数：111人</td>-->
                            <!--<td>施工人员：100人</td>-->
                            <!--<td>特种作业：15人</td>-->
                            <!--<td class="center">未到人数：2人</td>-->
                        <!--</tr>-->
                        <!--<tr class="odd gradeA">-->
                            <!--<td>水泥工&nbsp&nbsp ：50人</td>-->
                            <!--<td>钢筋工&nbsp&nbsp ：10人</td>-->
                            <!--<td>土木工&nbsp&nbsp ：5人</td>-->
                            <!--<td class="center">架子工&nbsp&nbsp ：5人</td>-->

                        <!--</tr>-->
                        <!--<tr class="even gradeA">-->
                            <!--<td>防水工&nbsp&nbsp ：5人</td>-->
                            <!--<td>砌筑工&nbsp&nbsp ：7人</td>-->
                            <!--<td>塔吊工&nbsp&nbsp ：5人</td>-->
                            <!--<td class="center">监理&nbsp&nbsp &nbsp&nbsp ：7人</td>-->

                        <!--</tr>-->
                        <!--</tbody>-->
                    <!--</table>-->

                    <div class="widget-title"> <span class="icon"><i class="icon-th"></i></span>
                        <h5>工人列表</h5>
                        <!--许永霖-->
                       <!-- <div class="demo1">
                            <ul>
                                <li>
                                    <div data-date="12-02-2012" class="input-append date datepicker ">
                                        <h5>起始时间</h5>
                                        <input type="text" data-date-format="mm-dd-yyyy" class="span7">
                                        <span class="add-on"><i class="icon-th"></i></span>
                                    </div>
                                </li>
                                <li>
                                    <div data-date="12-02-2012" class="input-append date datepicker ">
                                        <h5>结束时间</h5>
                                        <input type="text" data-date-format="mm-dd-yyyy" class="span7">
                                        <span class="add-on"><i class="icon-th"></i></span>
                                    </div>
                                </li>
                                <li><button style="height: 30px ; background-color: #989898;color: white;width: 75px">搜索</button></li>
                            </ul>
                        </div>-->
                        <!--end-->
                    </div>

                    <div class="widget-content nopadding">
                        <table class="table table-bordered ">
                            <thead id="tb">
                            <tr>
                                <th>#</th>
                                <th>员工号</th>
                                <th>姓名</th>
                                <th>性别</th>
                                <th>年龄</th>
                                <th>电话</th>
                                <th>工种类别</th>
                                <th>进入时间</th>
                                <th>出门时间</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>

                            </tbody>
                        </table>
                    </div>
                    <div class="pagination alternate">
                        <ul style="float: right">
                            <li><a href="#">Prev</a></li>
                            <li class="active"> <a href="#">1</a> </li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">Next</a></li>
                        </ul>
                    </div>
                </div>

            </div>
        </div>
    </div>
</div>

<script src="js/jquery.min.js"></script>
<script src="js/jquery-3.1.0.js"></script>
<script src="js/jquery.ui.custom.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/jquery.uniform.js"></script>
<script src="js/select2.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script>
<script src="js/matrix.js"></script>
<script src="js/matrix.tables.js"></script>
<!--日历-->
<script src="js/bootstrap-colorpicker.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/jquery.toggle.buttons.html"></script>
<script src="js/masked.js"></script>
<script src="js/jquery.uniform.js"></script>

<script src="js/matrix.form_common.js"></script>
<script src="js/wysihtml5-0.3.0.js"></script>
<script src="js/jquery.peity.min.js"></script>
<script src="js/bootstrap-wysihtml5.js"></script>
<!--日历-->

<!--***********许********-->
<td></td>
<td></td>
<td>男</td>
<td>38</td>
<td>13563968569</td>
<td></td>
<td>2017/8/10 7:</td>
<td>2017/8/10 18:</td>
<script>
    window.onload = function () {
        var datanav = [
            { "usernum": "20130501","name": "张亮","sex": "男", "age": "35", "phone": "13566521458",  "worktype":"建筑电工","intime":"2017/8/10 7:26" , "outtime": "2017/8/10 18:00","operation":"编辑 删除" },
            { "usernum": "20120502","name": "王强","sex": "男", "age": "40", "phone": "13320322568",  "worktype":"建筑架子工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:02","operation":"编辑 删除" },
            { "usernum": "20160203","name": "李力","sex": "男", "age": "41", "phone": "13725843156",  "worktype":"建筑起重信号工","intime":"2017/8/10 7:20" , "outtime": "2017/8/10 18:03","operation":"编辑 删除" },
            { "usernum": "20140603","name": "郭靖","sex": "男", "age": "32", "phone": "13325478964",  "worktype":"建筑起重机械司机","intime":"2017/8/10 7:25" ,"outtime": "2017/8/10 18:01","operation":"编辑 删除" },
            { "usernum": "20150308","name": "王朝强","sex": "男", "age": "39", "phone": "13634869512",  "worktype":"建筑塔吊工","intime":"2017/8/10 7:24" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
            { "usernum": "20140509","name": "赵清龙","sex": "男", "age": "38", "phone": "13320113659",  "worktype":"建筑架子工","intime":"2017/8/10 7:23" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
            { "usernum": "20140510","name": "王凯","sex": "男", "age": "38", "phone": "13563968569",  "worktype":"建筑中小型机械操作工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },

        ];
        var tb = document.getElementById("tt");
        for (var i = 0; i < datanav.length; i++) {
            var row = tb.insertRow(tb.rows.length);
            var c1 = row.insertCell(1);
            c1.innerHTML = datanav[i].usernum;
            var c2 = row.insertCell(2);
            c2.innerHTML = datanav[i].name;
            var c3 = row.insertCell(3);
            c3.innerHTML = datanav[i].sex;
            var c4 = row.insertCell(4);
            c4.innerHTML = datanav[i].age;

        }
    }



    window.onload = function () {
        var datanav = [
            { "usernum": "20130501","name": "张亮","sex": "男", "age": "35", "phone": "13566521458",  "worktype":"建筑电工","intime":"2017/8/10 7:26" , "outtime": "2017/8/10 18:00","operation":"编辑 删除" },
            { "usernum": "20120502","name": "王强","sex": "男", "age": "40", "phone": "13320322568",  "worktype":"建筑架子工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:02","operation":"编辑 删除" },
            { "usernum": "20160203","name": "李力","sex": "男", "age": "41", "phone": "13725843156",  "worktype":"建筑起重信号工","intime":"2017/8/10 7:20" , "outtime": "2017/8/10 18:03","operation":"编辑 删除" },
            { "usernum": "20140603","name": "郭靖","sex": "男", "age": "32", "phone": "13325478964",  "worktype":"建筑起重机械司机","intime":"2017/8/10 7:25" ,"outtime": "2017/8/10 18:01","operation":"编辑 删除" },
            { "usernum": "20150308","name": "王朝强","sex": "男", "age": "39", "phone": "13634869512",  "worktype":"建筑塔吊工","intime":"2017/8/10 7:24" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
            { "usernum": "20140509","name": "赵清龙","sex": "男", "age": "38", "phone": "13320113659",  "worktype":"建筑架子工","intime":"2017/8/10 7:23" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },
            { "usernum": "20140510","name": "王凯","sex": "男", "age": "38", "phone": "13563968569",  "worktype":"建筑中小型机械操作工","intime":"2017/8/10 7:27" , "outtime": "2017/8/10 18:05","operation":"编辑 删除" },

        ];
        var tb = document.getElementById("tb");
        for (var i = 0; i < datanav.length; i++) {
            var row = tb.insertRow(tb.rows.length);
            var c0 = row.insertCell(0);
            c0.innerHTML = i+1;
            var c1 = row.insertCell(1);
            c1.innerHTML = datanav[i].usernum;
            var c2 = row.insertCell(2);
            c2.innerHTML = datanav[i].name;
            var c3 = row.insertCell(3);
            c3.innerHTML = datanav[i].sex;
            var c4 = row.insertCell(4);
            c4.innerHTML = datanav[i].age;
            var c5 = row.insertCell(5);
            c5.innerHTML = datanav[i].phone;
            var c6 = row.insertCell(6);
            c6.innerHTML = datanav[i].worktype;
            var c7 = row.insertCell(7);
            c7.innerHTML = datanav[i].intime;
            var c8 = row.insertCell(8);
            c8.innerHTML = datanav[i].outtime;
            var c9 = row.insertCell(9);
            c9.innerHTML = datanav[i].operation;
            /*     var c10 = row.insertCell(10);
             c10.innerHTML = datanav[i].worktype;
             var c11 = row.insertCell(11);
             c11.innerHTML = datanav[i].level;
             var c12 = row.insertCell(12);
             c12.innerHTML = datanav[i].zuoyeleibie;
             var c13 = row.insertCell(13);
             c13.innerHTML = datanav[i].attendance;
             var c14 = row.insertCell(14);
             c14.innerHTML = datanav[i].operation;*/

        }
    }
</script>
<!--*********end**************-->
</body>
</html>
